<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh" xml:lang="zh">
<head>
    <meta charset="utf-8">
    <title>详细信息</title>
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <style type="text/css">
        .title {
            padding-top: 10px;
        }

        .layui-card-header {
            height: auto;
        }
    </style>
</head>
<body style="text-align:center;">
<div style="padding:20px;background-color: #F2F2F2;">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header"><h1 class="title" id="h1title">卡片面板</h1></div>
                <div class="layui-card-body" id="btcontent">
                    此文件发布时间为：<b>2019-04-05</b>，大小为 <b>20.04 MB</b>
                </div>
            </div>
        </div>
    </div>
</div>

<div style="padding:0 20px 20px 20px;background-color: #F2F2F2;text-align:left">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header"><h1 class="title">文件列表</h1></div>
                <div class="layui-card-body">
                    <table id="info-table" lay-filter="test"></table>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="layui/layui.js"></script>
<script src="static/js/jquery.min.js"></script>
<script src="static/js/functions.js"></script>
<script>
    $(document).ready(function () {
        $("#h1title")[0].innerHTML = getParameterByName('bttitle');
        $("#btcontent")[0].innerHTML = getParameterByName('info');
        let api_address = 'info-api.php?hash=';
        const hash = getParameterByName('hash');
        if (hash == null || hash === '') {
            //show some message on the page
        } else {
            api_address += hash;
            layui.use('table', function () {
                let table = layui.table;

                table.render({
                    elem: '#info-table'
                    , url: api_address //数据接口
                    , loading: true
                    , method: 'get'
                    , text: {
                        none: '此磁力链接为单独文件！' //默认：无数据。注：该属性为 layui 2.2.5 开始新增
                    }
                    , cols: [[ //表头
                        {type: 'numbers', title: '#', width: 80, fixed: 'left'}
                        , {field: 'path', title: '文件路径', minWidth: 400, sort: true, align: 'left'}
                        , {
                            title: '后缀', width: 75, sort: true, templet: function (d) {
                                const file_path = d.path;
                                if (file_path.lastIndexOf(".") === -1) {
                                    return '';
                                } else {
                                    return file_path.substring(file_path.lastIndexOf("."));
                                }
                            }
                        }
                        , {field: 'length', title: '大小', width: 100, sort: true}
                    ]]
                    , parseData: function (res) { //res 即为原始返回的数据
                        let data = res.files;
                        if (data == null) {
                            return {"code": 0, "msg": 'no data', "count": 0, "data": ''};
                        }
                        for (let i = data.length - 1; i >= 0; i--) {
                            if (data[i].path.startsWith('_____padding_file_') && data[i].path.endsWith('____')) {
                                data.remove(i);
                            } else {
                                data[i].length = fileLength2Size(data[i].length);
                            }
                        }
                        return {
                            "code": 0, //解析接口状态
                            "msg": 'message', //解析提示文本
                            "count": data.length, //解析数据长度
                            "data": data //解析数据列表
                        };
                    }
                });
            });
        }
    });
</script>
</body>
</html>